//该文件专门用于创建整个应用的路由器
import VueRouter from 'vue-router'

import Home from '../pages/Home'
import News from '../pages/News'
import Message from '../pages/Message'
import Detail from '../pages/Detail'
import About from '../pages/About'



//创建路由器实例
const router = new VueRouter({
  routes: [
    {
      path: '/about',
      name: 'guanyu',
      component: About
    },
    {
      path: '/home',
      name: 'home',
      component: Home,
      children: [
        {
          path: 'news',
          name: 'news',
          component: News
        },
        {
          path:'message',
          name:'message',
          component: Message,
          children: [
            {
              path: 'detail/:id/:title',
              name: 'xiangqing',
              component: Detail,
              //props的第一种写法，值为对象，该对象中的所有key-value都会以props的形式传给Detail组件
            //   props:{a:1,b:2 }
            //props的第二种写法，值为布尔值，若布尔值为真，就会把该路由组件收到的所有params参数，以props的形式传给Detail组件
            // props: true
            //props的第二种写法，值为函数
                props($route) {
                    return {
                        id: $route.params.id,
                        title: $route.params.title 
                    }
                }
            }
          ]
        }
      ]
    },
    
  ]
});
//导出路由器实例
export default router